<template>
	<view class="wrapper">
		<view class="shadow-lg radius">
			<view aria-role="textbox" aria-label="请填写10字以上的问题描述, 以便我们提供更多的帮助" class="margin radius">
				<view class="cu-form-group">
					<textarea maxlength="200" v-model="fbck.ftext"  @input="textareaBInput" placeholder="请填写10字以上的问题描述, 以便我们提供更多的帮助"></textarea>
				</view>
				<view style="float:right; margin-right: 40rpx; margin-top: -60rpx;"><text>{{fbck.ftext.length}} / 200</text></view>
			</view>
		</view>
		<button aria-role="button" class="margin bg-blue" @click="submitData()">提交</button>
		
		<view class="cu-bar margin-top">
			<view aria-role="tab" class="action">
				<text class="cuIcon-title text-blue"></text>
				<text class="font-s">历史投诉与建议</text>
			</view>
		</view>
		<view v-for="(item,index) in fsavelist" :key="index" aria-role="button" class="margin-top-sm opinion margin-lr padding-bottom" @click="toDetails(item)">
			<view class="padding radius" style="line-height: 48rpx;">{{item.ftext}}</view>
			<view class="flex-sub text-gray margin-left">
				<text class="margin-to">{{item.btime}}</text>
				<text class="text-red fr margin-right" v-if="item.state == '0'">待回复</text>
				<text class="text-green fr margin-right" v-if="item.state == '1'">已回复</text>
			</view>
		</view>
		<view v-if='fsavelist.length <= 0' aria-role="tab">
			<no-data :src="img_src + 'zwts.png'">
				<view bindtap='a' class="text-gray">竟然一条建议都没有</view>
				<view>您的建议与投诉是我们改进的动力</view>
			</no-data>
		</view>
	</view>
</template>

<script>
	import noData from '@/components/nodata/no-data.vue'
	export default {
		data() {
			return {
				fbck: {ftext: ''},
				img_src: this.$utils.SYS_URL + this.$utils.IMG_URL,
				user:{},
				fsavelist:[],
			}
		},
		components:{
			"no-data":noData
		},
		onLoad() {
			this.user=uni.getStorageSync('users');
			this.listData(this.user.uid)
		},
		methods: {
			listData(userid){
				uni.showLoading({
					title:"加载中"
				})
				this.$request.getForm('/view/news/flist',{uid:userid}).then(res => {
					uni.hideLoading();
					if(res.meta.success) {
						this.fsavelist=res.data
					} 
				})
			},
			textareaBInput(e) {
				this.fbck.ftext = e.detail.value;
			},
			submitData(){
				this.fbck.ftitle = '操作反馈';
				if(!this.fbck.ftext) {
					this.$utils.msg('反馈信息为空，请填写10字以上的问题描述, 以便我们提供更多的帮助');
					return;
				}
				let that = this;
				this.$request.postJson('/view/news/fsave',this.fbck).then(
					res=>{
						if(res.meta.success) {
							that.listData(that.user.uid)
						} else {
						this.$utils.msg(res.meta.message)
					}
					}
				)
			},
			toDetails(item){
				uni.navigateTo({url:`/pages_serv/news/details?item=${JSON.stringify(item)}`})
			}
		}
	}
</script>

<style>
	page{
		background-color: #f4f5f6;
	}
	.cu-form-group textarea {
		height: 9.5em; 
	}
	.cu-form-group{
		border-radius: 16rpx;
	}
	.opinion{
		background: #fff;
		border-radius: 16rpx;
	}
</style>
